<h2>My Heroes</h2>
<ul class="heroes">
  <li
    *ngFor="let hero of heroes"
    [class.selected]="hero === selectedHero"
    (click)="onSelect(hero)"
  >
    <span class="badge">{{ hero.id }}</span> {{ hero.name }}
  </li>
</ul>

<div *ngIf="selectedHero">
  <h2>{{ selectedHero.name | uppercase }} Details</h2>
  <div><span>id: </span>{{ selectedHero.id }}</div>
  <div>
    <label
      >name:
      <input [(ngModel)]="selectedHero.name" placeholder="name" />
    </label>
  </div>
</div>
